<template>
	<div id="props-container">
		<h4>Props全局组件</h4>
		<!-- 只读的不能改 -->
		<p>init的值只读不能改：{{init}}</p>
		<!-- 想要修改需要把值转存到data里的count属性里 -->
		<p>count的值能改:{{count}}</p>
		
		<button @click="count++">+1</button>
	
	</div>
</template>

<script>
	export default{
		//使用props组定义属性实现每个组件的值不同的效果
		///props:['init','flag'],
		
		//使用默认值
		props:{
			init:{
				default:0,
				type:Number,//指定数据类型必须数字型
				required:true//必填项，不赋值报错
			}
		},
		
		data(){
			return {
				count: this.init
			}
		},
		
		//销毁方法
		destroyed(){
			console.log('子组件销毁')
		},
	    beforeDestroy() {
			console.log("子组件销毁前...")
		}
	}
</script>

<style>
</style>
